<template>
  <div class="shop">
      <div class="top">
          <h5>{{title}}<span>{{greentitle}}</span></h5>
          <p>更多</p>
      </div>
      <img :src="bigimg" class="images">
      <div class="books">
          <Shopsingle v-for="(v,i) in goods" :key="i" :littleimg="v.littleimg" :littletext="v.littletext"/>
      </div>
  </div>
</template>

<script>
import Shopsingle from './shopsingle.vue'
export default {
  props:['title','greentitle','bigimg','goods'],
  
  components:{
    Shopsingle
  }
}

</script>

<style scoped>
.shop{
    width:3.2rem;
    height:3.3rem;
    background-color: #f2f2f2;
    margin:auto;
    margin-bottom:0.17rem;
}
.top{
  height:0.41rem;
  display: flex;
  justify-content: space-between;
}
.top h5{
  font-size:0.18rem;
  line-height: 0.41rem;
}
.top span{
  color:#6db987
}
.top p{
  font-size:0.12rem;
  line-height: 0.41rem;
  color:#a1a2a5
}
.images{
  width:100%;
  height:1.2rem;
  display: block;
  border-radius: 0.07rem;
  margin-bottom:0.1rem
}
.books{
  width:100%;
  display: flex;
  justify-content: space-evenly;
}
</style>